<template>
  <div>
    <el-button type="primary" @click="changeShow">changeShow</el-button>
    <br>
    <el-button type="primary" @click="changeShow2">changeShow-2(components method)</el-button>
    <br>
    <el-button type="warning" @click="showToast">showToast(global method)</el-button>
    <toast-2 v-model="show"></toast-2>
    <toast-plus v-model="show2"></toast-plus>
  </div>
</template>

<script>
import Toast2 from '@/components/Toast-2/index'
import ToastPlus from '@/components/Toast-plus'
export default {
  data(){
    return{
      show:false,
      show2:false
    }
  },
  methods:{
    changeShow(){
      this.show = !this.show
    },
    changeShow2(){
      this.show2 = !this.show2
    },
    showToast(){
      this.$toast('hello world', 1000)
    }
  },
  components:{
    Toast2,
    ToastPlus
  }
}
</script>

<style>

</style>